<script setup lang="ts">
import { computed, onMounted, reactive, ref } from "vue";
import { ElForm } from "element-plus";
import TitleGroup from "@/components/FormRowTitle/index.vue";
const loading = ref(false);

const queryForm = reactive({
  data: {
    activeVppId: undefined,
    activeUserId: undefined,
    len: 1,
    activeTime: [],
    type: 1
  }
});

const lenData = reactive({
  data: [
    {
      value: 1,
      label: "中长期"
    },
    {
      value: 2,
      label: "短期"
    },
    {
      value: 3,
      label: "超短期"
    }
  ]
});

const save = () => {};
const reset = () => {};
onMounted(() => {});
const yesOrNo = ref([
  {
    value: 1,
    label: "是"
  },
  {
    value: 2,
    label: "否"
  }
]);
const form = reactive({
  data: {
    one: 0,
    two: 1,
    three: 0,
    four: 96,
    five: 0.1,
    six: 3,
    seven: 3,
    eight: 9,
    nine: 0.4,
    ten: 0.5,
    ele: 0.5,
    elw: 1,
    elt: 2,
    feg: 2,
    grew: 7,
    grewre: 0.000001,
    rwg: 4,
    getrh: 0.3,
    gewq: 0,
    ehe: 3,
    htre: 8
  },
  rules: {}
});
</script>

<template>
  <div class="main h-[calc(100%-29px)]">
    <el-card v-loading="loading" class="w-full my-card-full">
      <!--      <el-row>-->
      <!--        <el-form :inline="true" :model="queryForm.data" label-width="0px">-->
      <!--          <el-form-item>-->
      <!--            <el-select-->
      <!--              v-model="queryForm.data.len"-->
      <!--              placeholder="选择类型"-->
      <!--              style="width: 200px"-->
      <!--            >-->
      <!--              <el-option-->
      <!--                v-for="item in lenData.data"-->
      <!--                :key="item.value"-->
      <!--                :value="item.value"-->
      <!--                :label="item.label"-->
      <!--              />-->
      <!--            </el-select>-->
      <!--          </el-form-item>-->
      <!--          <el-form-item class="ml-[10px]">-->
      <!--            <el-button type="primary" @click="reset">刷新</el-button>-->
      <!--            <el-button type="warning" @click="save">保存</el-button>-->
      <!--          </el-form-item>-->
      <!--        </el-form>-->
      <!--      </el-row>-->
      <el-form
        ref="formRef"
        :model="form.data"
        :rules="form.rules"
        label-width="150px"
        style="display: block; width: 100%"
        class="px-[20px]"
      >
        <el-row :gutter="20">
          <el-col :span="12">
            <el-card>
              <TitleGroup :title="'基本参数'">
                <el-row :gutter="20" class="pt-[15px]">
                  <el-col :span="24">
                    <el-form-item label="指数平滑法权重" prop="one">
                      <el-input v-model="form.data.one" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="神经网络法权重" prop="two">
                      <el-input v-model="form.data.two" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="线性回归法权重" prop="three">
                      <el-input v-model="form.data.three" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="时间点" prop="four">
                      <el-input v-model="form.data.four" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="合格标准" prop="five">
                      <el-input v-model="form.data.five" />
                    </el-form-item>
                  </el-col>
                </el-row>
              </TitleGroup>
            </el-card>
          </el-col>
          <el-col :span="12">
            <el-card>
              <TitleGroup :title="'神经网络法'">
                <el-row :gutter="20" class="pt-[15px]">
                  <el-col :span="24">
                    <el-form-item label="输入变量数" prop="six">
                      <el-input v-model="form.data.six" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="输出变量数" prop="seven">
                      <el-input v-model="form.data.seven" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="隐含变量数" prop="eight">
                      <el-input v-model="form.data.eight" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="学习系数1" prop="nine">
                      <el-input v-model="form.data.nine" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="学习系数2" prop="ten">
                      <el-input v-model="form.data.ten" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="学习系数3" prop="ele">
                      <el-input v-model="form.data.ele" />
                    </el-form-item>
                  </el-col>
                </el-row>
              </TitleGroup>
            </el-card>
          </el-col>
          <el-col :span="12">
            <el-card>
              <TitleGroup :title="'相似日'">
                <el-row :gutter="20" class="pt-[15px]">
                  <el-col :span="24">
                    <el-form-item label="是否考虑节假日" prop="elw">
                      <el-select v-model="form.data.elw">
                        <el-option
                          v-for="item in yesOrNo"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="是否考虑星期" prop="elt">
                      <el-select v-model="form.data.elt">
                        <el-option
                          v-for="item in yesOrNo"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="是否考虑天气" prop="feg">
                      <el-select v-model="form.data.feg">
                        <el-option
                          v-for="item in yesOrNo"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="最大相似天数" prop="grew">
                      <el-input v-model="form.data.grew" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="精准度" prop="grewre">
                      <el-input v-model="form.data.grewre" />
                    </el-form-item>
                  </el-col>
                </el-row>
              </TitleGroup>
            </el-card>
          </el-col>
          <el-col :span="12">
            <el-card>
              <TitleGroup :title="'指数平滑法'">
                <el-row :gutter="20" class="pt-[15px]">
                  <el-col :span="24">
                    <el-form-item label="短期平滑点数" prop="rwg">
                      <el-input v-model="form.data.rwg" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="短期平滑系数" prop="getrh">
                      <el-input v-model="form.data.getrh" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="超短期平滑系数" prop="gewq">
                      <el-input v-model="form.data.gewq" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="超短期过滤系数" prop="ehe">
                      <el-input v-model="form.data.ehe" />
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="超短期预测点数" prop="htre">
                      <el-input v-model="form.data.htre" />
                    </el-form-item>
                  </el-col>
                </el-row>
              </TitleGroup>
            </el-card>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
  </div>
</template>

<style scoped lang="scss">
.my-card-full {
  :deep(.el-card__body) {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;

    .demo-tabs {
      display: flex;
      flex: 1;
      flex-direction: column;
      overflow: hidden;

      .el-tabs__content {
        flex: 1;

        .el-tab-pane {
          width: 100%;
          height: 100%;
        }
      }
    }
  }
}
</style>
